<template>
<!-- 实时因子订阅 -->
  <div v-loading="loading" element-loading-text="加载中。。。">
    <el-card style="overflow:visible;">
      <el-form  :model="form" size="mini" label-position="top" ref="form">
        <el-row :gutter="10">
          <el-col :md="6" :lg="4">
          <el-form-item label="订阅对象" prop="STATICOBJECT">
            <el-select v-model="form.STATICOBJECT" filterable placeholder="请选择订阅对象">
                            <el-option
                v-for="item in STATICOBJECTLIST"
                :key="item.value"
                :label="item.name"
                :value="item.value"
                :disabled="item.disabled"
              ></el-option>
            </el-select>
          </el-form-item>
          </el-col>
          <el-col  :lg="4" :md="6">
            <el-form-item label="G平台订阅"  prop="G_SERVER">
               <el-select v-model="form.G_SERVER" filterable placeholder="请选择G平台订阅">
                            <el-option
                                    v-for="item in G_SERVERLIST"
                                    :key="item.value"
                                    :label="item.name"
                                    :value="item.value"
                                    :disabled="item.disabled"
              ></el-option>
            </el-select>
            </el-form-item>
          </el-col>
          <el-col  :lg="4" :md="6">
            <el-form-item label="订阅统计量名"  prop="STATICMETRIC">
              <el-input v-model="form.STATICMETRIC" placeholder="请输入订阅统计量名" ></el-input>
            </el-form-item>
          </el-col>
           <el-col  :lg="4" :md="6">
            <el-form-item label="因子名称"  prop="METRICNAME">
              <el-input v-model="form.METRICNAME" placeholder="请输入因子名称" ></el-input>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     
            </el-form-item>
          </el-col>
          <el-col :lg="2" :md="3"  class="searchBtnMarginTop">
            <el-button type="primary" icon="el-icon-search" :loading="loading" size="mini" @click="query(1)">查询</el-button>
          </el-col>
            <el-col :md="3" :lg="2" class="searchBtnMarginTop">
              <el-button type='warning' size='mini' icon='el-icon-refresh' @click="clearForm('form')">重置</el-button>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card style="margin-top:10px;">
       <el-row :gutter="10">
          <!-- <el-col :lg="2" :md="3" v-if="btnPermission('Button_User_Add')">
          <el-button type="primary" size="mini" @click="addlocalCard" icon="el-icon-plus">新增</el-button>
        </el-col>
         <el-col :lg='2' :md='3' v-if="btnPermission('Button_DevInfo_Edit')">
            <el-button type='primary' size='mini' icon='el-icon-edit' class='b-button' :disabled="currentRow.length!=1"
            @click='DialogShow'>修改</el-button>
        </el-col>
        <el-col :lg="2" :md="3" v-if="btnPermission('Button_User_Delete')">
          <el-button type="danger" size="mini" icon="el-icon-delete" @click="del" :disabled="currentRow.length!=1">删除</el-button>
        </el-col> -->
         <el-col :lg="2" :md="3">
           <!-- ||currentRow.STATICOBJECT='agent' currentRow.length<1|| -->
          <el-button type="primary" size="mini" icon="el-icon-circle-check" @click="subscribe" :disabled="currentRow.length<1||currentRow[0].STATICOBJECT =='agent'">订阅</el-button>
        </el-col>
        <el-col :lg="2" :md="3">
          <el-button type="danger" size="mini" icon="el-icon-circle-close" @click="cancel" :disabled="currentRow.length<1||currentRow[0].STATICOBJECT =='agent'">取消订阅</el-button>
        </el-col>
        
      </el-row> 
      <el-table
        :data="tableData"

        ref="table"
        border
        class="tableMarginTop"
        highlight-current-row
        @selection-change="handleCurrentChange"
        header-row-class-name="tableHeaderClass"
        style="min-height:390px;width:100%">
        <el-table-column type="selection" width="40px"></el-table-column>
        <el-table-column prop="ID" label="序列号" width="80px"></el-table-column>
        <el-table-column prop="STATICOBJECT" label="订阅对象" :formatter="dataFormat"></el-table-column>
         <el-table-column prop="STATICMETRIC" label="订阅统计量名"  width="180px"></el-table-column>
        <el-table-column prop="OBJECTNAME" label="订阅对象渠道"  width="300px"></el-table-column>
        <el-table-column prop="AGENTID" label="坐席ID"></el-table-column>
        <el-table-column prop="REFERNCEID" label="订阅唯一标识"  width="180px"></el-table-column>
        <el-table-column prop="METRICNAME" label="因子名称"  width="180px"></el-table-column>
        <el-table-column prop="MONIKEY" label="因子编码"  width="320px"></el-table-column>
         <el-table-column prop="G_SERVER" label="G平台订阅" width="120px" :formatter="dataFormat"></el-table-column>
         <el-table-column prop="INTERVAL" label="订阅间隔时间(秒)"  width="160px"></el-table-column>
         <el-table-column prop="CHACEFLAG" label="缓存标志" :formatter="dataFormat"></el-table-column>   
        <el-table-column prop="UPDATETIME" label="更新时间"  width="180px"></el-table-column>
        <el-table-column prop="FILTER" label="过滤器"></el-table-column>
        <el-table-column prop="PROTOCOLID" label="进程ID"></el-table-column>
        <el-table-column prop="REMARK" label="备注"></el-table-column>
         -->
      </el-table>
      <div style="text-align:right;margin-top:20px;" v-show="this.tableData">
        <el-pagination
          :current-page="currentPage"
          background
          @size-change="handleSizeChange"
          :page-sizes="[10,25,50,100]"
          :page-size="pageSize"
          layout="total,sizes, prev, pager, next, jumper"
          :total="totalRcrdNum"
          @current-change="changePage"
        ></el-pagination>
      </div>
    </el-card>
     <!-- 弹窗 -->
    <keep-alive>
      <component :is="dialogList.addaddlocalCardDialog" :option="dialogOptions" @refreshTable="query(1)" ></component>
    </keep-alive>
  </div>
</template>

<script>
import toolBox from "@/common/utils/toolBox";
import addaddlocalCardDialog from "./dialog/addDialog";
// import request from "@/common/utils/request";
// import request1 from "@/common/utils/requestTest";

import getGlobalParams from "@/common/utils/getGlobalParams";
import query from "@/message/paramManagement/realTimeParamSetting/query";
import subscribe from "@/message/paramManagement/realTimeParamSetting/subscribe";
// import dele from "@/message/paramManagement/realTimeMonitorParamSetting/del";
import requestYg from "@/common/utils/requestYg";

// import Update from "@/message/paramManagement/realTimeMonitorParamSetting/update";
// import Order from "@/message/paramManagement/realTimeMonitorParamSetting/order";
export default {
  name: "",
  data() {
    return {
      "STATICOBJECT": {
          "agent": "坐席",
          "queue": "队列",
          // "routepoint": "路由点",
          "groupagents": "坐席组",
      },
      // "STATUS": {
      //     "0": "有效",
      //     "1": "无效",
      //     // "2": "订阅成功",
      //     // "3": "未订阅",
      // },
      "G_SERVER":{
         "1": "已订阅",
         "0": "未订阅",
         "2":"订阅中",
         "3":"订阅失败"

      },
      "FLAG": {
          "1": "是",
          "0": "否"
      },
      STATICOBJECTLIST: [
        { name: "坐席", value: "agent" },
        { name: "队列", value: "queue" },
        // { name: "路由点", value: "routepoint" },
        { name: "坐席组", value: "groupagents" }
      ],
       G_SERVERLIST: [
        { name: "未订阅", value: "0" },
        { name: "已订阅", value: "1" },
        { name: "订阅中", value: "2" },
        { name: "订阅失败", value: "3" },
       
      ],
      pageSize: undefined, //表格每页的条数
      form: {
        STATICOBJECT:"",
        STATICMETRIC: "",
        METRICNAME:"",
        G_SERVER:"",

      },
      currentRow: [], //表格当前选中行
      currentPage: 1, //表格当前页
      totalRcrdNum: 0,
      tableData: [], //表格 数据
      loading: false, //loading遮罩
      total: 0, //表格总条数
      checkedUser: false, //控制按钮是否可用
      isDisabledDel: false,
       dialogList: {
        //指定被渲染组件列表
        addaddlocalCardDialog,
      },
      dialogOptions: {
        //新增
        isShow: false
      },
    };
  },
  computed: {},
  
  created: function(){
    this.pageSize = getGlobalParams.get("PageSize");
    this.query(1);
  },
   watch: {
  },
  methods: {
    //订阅
    subscribe() {
      //  console.log("当前选中行currentRow",this.currentRow);
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.loading = true;
          let resBody = new subscribe();
            // resBody.data.STATICOBJECT =  "";
            let IDARR = "";
           
            for (let i = 0; i < this.currentRow.length; i++) {
           
            const element = this.currentRow[i].ID;
            if(IDARR==""){
              IDARR =  element
            }else{
              IDARR = IDARR +","+ element
            }
          }
            resBody.data.ID =  IDARR;
            // resBody.data.G_SERVER =  "0";
            // console.log("订阅因子发送的data,",resBody.data);
            requestYg(resBody)
              .then(response => {
                //  console.log("订阅返回的response",response);
                if (response.SYS_HEAD.ReturnCode === "000000") {
                  this.$message({
                    type: "success",
                    message: `订阅处理中`
                  });
                   this.isShow= false;
                   this.query(1);
                }else{
                  this.$message({
                    type: "error",
                    message: `${response.SYS_HEAD.ReturnMessage}!`
                  });
                }
                this.loading = false;
              })
              .catch(error => {
                this.loading = false;
              });
        } else {
          return false;
        }
      });
    },
 

    //取消订阅
    cancel() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.loading = true;
          let resBody = new subscribe();
            resBody.data.OPERAFLAG = "0";
            let IDARR = "";
            for (let i = 0; i < this.currentRow.length; i++) {
            // if(this.currentRow[i].STATICOBJECT=="agent"){
            //   resBody.data.STATICOBJECT =  "agent"
            // }
            const element = this.currentRow[i].ID;
            if(IDARR==""){
              IDARR =  element
            }else{
              IDARR = IDARR +","+ element
            }
          }
            resBody.data.ID =  IDARR;
          
            // console.log("取消订阅发送的data,",resBody.data);
            requestYg(resBody)
              .then(response => {
                console.log("取消订阅返回的response",response);
                if (response.SYS_HEAD.ReturnCode === "000000") {
                  this.$message({
                    type: "success",
                    message: `取消订阅处理中`
                  });
                   this.isShow = false;
                   this.query(1);
                }else{
                  this.$message({
                    type: "error",
                    message: `${response.SYS_HEAD.ReturnMessage}!`
                  });
                }
                this.loading = false;
              })
              .catch(error => {
                this.loading = false;
              });
        } else {
          return false;
        }
      });
    },

    async query(num){
            this.currentPage = num;
      let resBody = new query();
      resBody.data.STATICOBJECT = this.form.STATICOBJECT;//订阅对象
       resBody.data.STATICMETRIC=this.form.STATICMETRIC;//订阅统计量名
       resBody.data.METRICNAME= this.form.METRICNAME;//因子名称
      resBody.data.G_SERVER= this.form.G_SERVER;//G平台订阅
     
      resBody.data.PAGEFLAG = 4;
      resBody.data.PAGEROWNUM = this.pageSize; 
      resBody.data.CURRPAGE = num;
// console.log("实时因子订阅query的resBody.data",resBody.data);
        requestYg(resBody)
        .then(response => {
          // console.log("因子订阅查询的response，",response);
      
           this.totalRcrdNum = response.RSP_BODY.TOTALROWNUM ? response.RSP_BODY.TOTALROWNUM : 0;
          if (response.SYS_HEAD.ReturnCode === "000000") {
            this.tableData = response.RSP_BODY.struct || [];
        
          } else {
            this.$message({
              type: "error",
              message: response.SYS_HEAD.ReturnMessage
            });
            this.tableData=[];
          }
          this.loading = false;
        })
        .catch(error => {
          this.loading = false;
        });
    
    },
    del() {//删除弹出
      this.$confirm("该条因子参数将被删除, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.paramDel();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
        this.limstr="";
    },
    paramDel() {      //删除交易限额
      this.loading = true;
      let resBody = new dele();
      resBody.data.ID = this.currentRow[0].ID;

      requestYg(resBody)
        .then(response => {
          if (response.SYS_HEAD.ReturnCode === "000000") {
            this.loading = false;
            this.$message({
              type: "success",
              message: "因子参数删除成功!"
            });
            this.query(1);
          } else {
            this.loading = false;
            this.$message({
              type: "success",
              message: "因子参数删除失败!"
            });
          }
        })
        .catch(error => {
          this.loading = false;
        });
    },
    // 格式化表格
     dataFormat(row, column,cellValue) {    
      //格式化表格
      // console.log("格式化表格时的row:",row,"column:",column,"cellValue",cellValue);
      // 订阅对象
        if (column.property == "STATICOBJECT")
        return this.STATICOBJECT[row[column.property]];
        // 缓存标志
        if (column.property == "CHACEFLAG")
        return this.FLAG[row[column.property]];
         //G_SERVER
        if (column.property == "G_SERVER")
        return this.G_SERVER[row[column.property]];
        // 有效状态
        // if (column.property == "STATUS")
        // return this.STATUS[row[column.property]];
    },
    // 添加
     addlocalCard() {
      //添加
      this.dialogOptions.isShow = true;
      this.dialogOptions.isChecked = false;
      this.dialogOptions.title = "因子参数新增";
      this.dialogOptions.STATICOBJECTLIST = this.STATICOBJECTLIST;
      this.dialogOptions.log = "1"; //添加
    },
    // 对话框展示
     DialogShow() {
        this.dialogOptions.isShow = true;
        this.dialogOptions.isChecked = true;
        this.dialogOptions.currentRow = this.currentRow[0];
        this.dialogOptions.title = "因子参数修改";
        this.dialogOptions.STATICOBJECTLIST = this.STATICOBJECTLIST;
        this.dialogOptions.log = "2"; //修改
    },
     // 重置查询条件
    clearForm(item) {
      this.$refs["" + item].resetFields();
    },
    changePage(val) {
      this.currentPage = val;
      // console.log("changePage",val);
      this.query(val);
    },
    refreshTable() {
      //刷新数据并清除选中的数据
      // this.businesstypeList();
    },
  
    handleCurrentChange(val) {
      //表格选中行改变事件设置当前行的值（currentRow）已经改变控制按钮是否可用
      this.currentRow = val;
    },
    handleSizeChange(val){
      this.pageSize=val;
    
      this.query(1);
    }
  }
};
</script>


<style lang="scss" scoped>
.selectTree {
  min-width: 150px;
}
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}
.dialog-text {
  display: inline-block;
  width: 100%;
  text-align: center;
  color: red;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}

.el-card {
  width: 100%;
}
.el-form-item {
  margin-left: 30px;
}
.el-form-item1 {
  margin-left: 10px;
}
.box2-button {
  width: 80px;
}

.el-card {
  overflow: inherit;
}
</style>